<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>

<body>
    <form method="post" action="/body">
        <!-- name/value -->
        <input name="username" value="11"></input>
        <input name="password" value="11"></input>
        <input type="submit" value="提交"></input>
    </form>


    <form method="post" id="form2">
        <!-- name/value -->
        <input class="username" name="username" value="username"></input>
        <input class="password" name="password" value="password"></input>
        <input type="submit" value="提交"></input>
    </form>
    <script src="/jquery.min.js"></script>
    <script>
        $(function () {
            var form = $("#form2");
            form.on("submit", function (e) {
                e.preventDefault();
                $.ajax({
                    url: "/body2",
                    method: "post",
                    contentType:"application/json;charset=utf-8",
                    data:JSON.stringify( {
                        username: $("#form2 .username").val(),
                        password: $("#form2 .password").val()
                    }),
                    //传过去的格式要变化(json字符串)
                    success: function (data) {
                        console.log(data);
                    }
                })
            })
        })
        //原生  同步的方式
        //ajax 异步方式
    </script>

</body>

</html>